<template>
<!-- 渠道确认 退保 -->
    <div>
 <el-form :inline="true"  class="demo-form-inline" v-show="type=='渠道确认'">
                <el-form-item label="时间范围">
                    <el-date-picker v-model="stimeArry" type="daterange" placeholder="选择日期范围">
                    </el-date-picker>
                </el-form-item>           
                  <el-form-item>
                    <el-button type="primary" @click="onSubmit">查询</el-button>
                </el-form-item>
            </el-form>
        <el-table v-if="tableData3.length>0" :data="tableData3" border style="width: 100%"  @selection-change="handleSelectionChange">
            <el-table-column type="selection" width="55" v-if="type!='渠道退保'">
            </el-table-column>
              <el-table-column prop="ORGANIZATION_NAME" label="渠道名称" width="200">
            </el-table-column>
              <el-table-column prop="CUSTOM_NAME" label="被保险人姓名" width="180">
            </el-table-column>           
            <el-table-column prop="CUSTOM_SEX" label="被保险人性别" width="180" >
            </el-table-column>
            <el-table-column prop="PRODUCE_NAME" label="购买保险套餐" width="180">
            </el-table-column>
            <el-table-column prop="SALESDETAIL_MONEY" label="保费金额" width="200">
            </el-table-column>
               <el-table-column prop="SALESDETAIL_ADDMONEY" label="增额保费" width="200" >
            </el-table-column>
            <el-table-column prop="BROKERAGE_RATIO" label="返佣比例（%）" width="200" >
            </el-table-column>
            <el-table-column prop="SALESDETAIL_MONEYTIME" label="缴费日期" width="200" :formatter="localDataFomatter">
            </el-table-column>
          
            <el-table-column prop="BROKERAGE_FROM" label="订单来源" width="200" >
            </el-table-column>

            <el-table-column label="操作" width="200" fixed="right" v-if="type=='渠道确认'">
                <template scope="scope">
                    <el-button type="text" size="media" @click="centerAll(scope.row.BROKERAGE_ID)">
                        <i class="el-icon-view"> 确认</i>
                    </el-button>
                </template>
            </el-table-column>
            <el-table-column label="操作" width="200" fixed="right" v-if="type=='渠道退保'">
                <template scope="scope">
                    <el-button type="text" size="media" @click="goBackCenter(scope.row.BROKERAGE_ID)">
                        <i class="el-icon-view"> 确认</i>
                    </el-button>
                </template>
            </el-table-column>
        </el-table>
        <div class="block">
            <el-pagination @current-change="handleCurrentChange" :current-page="currentPage1" :page-size="10" layout="total, prev, pager, next" :total="pagecount">
            </el-pagination>    
        </div>
         <el-dialog title="退保确认" :visible.sync="backCenterBool" v-if="backCenterBool"  :modal="type=='新增'">
                <el-form   class="demo-form-inline" >
                <el-form-item label="是否需要追回" >
                  <el-radio-group v-model="backModel.BROKERAGE_ISNEEDBACK">
                   <el-radio label="是"></el-radio>
                    <el-radio label="否"></el-radio>
                    </el-radio-group>
                </el-form-item> 
                 <el-form-item label="追回金额" v-show="backModel.BROKERAGE_ISNEEDBACK=='是'">
                 <el-input v-model="backModel.BROKERAGE_BACKMONEY" style="width:200px;">    
                 </el-input>             
                </el-form-item>                
                  <el-form-item>
                    <el-button type="primary" @click="backUpdate">确认</el-button>
                </el-form-item>
            </el-form>
            </el-dialog>
    </div>
</template>
<script>
import api from "@/js/api";
export default {
  data() {
    return {
      pagecount: 0,
      currentPage1: 1,
      timeArry: [],
      tableData3: [],
      stimeArry: [],
      selectList: [],
      backCenterBool:false,
      backModel: {
        BROKERAGE_ID: "",
        BROKERAGE_ISNEEDBACK: "",
        BROKERAGE_BACKMONEY: "",
        BROKERAGE_STATE:"已退保追回"
      }
    };
  },
  props: {
    id: {
      type: {
        type: String,
        default: ""
      }
    },
    type: {
      type: String,
      default: "待沟通"
    }
  },
  methods: {
    //时间过滤器
    localDataFomatter(row, column, cellValue) {
      cellValue = cellValue + "Z";
      var data = new Date(cellValue);
      var dataString =
        data.getFullYear() +  "/" +
        ((data.getMonth() + 1)>=10?(data.getMonth() + 1):"0"+(data.getMonth() + 1)) +
        "/" +
        (data.getDate()>=10?data.getDate():"0"+data.getDate());
      return dataString;
    },
    changeInformation(id) {
      this.$emit("changeInformation", id);
    },
    //多选回调
    handleSelectionChange(val) {
      for (let index = 0; index < val.length; index++) {
        const element = val[index];
        this.selectList.push(val[index].BROKERAGE_ID);
      }
    },
    //佣金 退保 更新
    backUpdate() {
      let that = this;
      api.BrokerUpdate(that, this.backModel, function(msg) {
        that.backCenterBool = false;
         that.$notify.success({
          title: "成功",
          message: "处理完成"
        });
        that.getDate();
      });
    },
    //渠道退保 确认
    goBackCenter(id) {
      // console.log(id);
      this.backCenterBool = true;
      this.backModel.BROKERAGE_ISNEEDBACK = "";
      this.backModel.BROKERAGE_BACKMONEY = "";
      this.backModel.BROKERAGE_ID = id;
    },
    //批量确认
    centerAll(id) {
      var data = [];
      if (id) {
        data.push(id);
      } else {
        data = this.selectList;
      }
      let that = this;
      // console.log(data);
      api.BrokerageUpdateAll(that, data, function(msg) {
        that.$notify.success({
          title: "成功",
          message: "确认成功"
        });
        that.getDate();
      });
    },

    handleCurrentChange() {},
    onSubmit() {
      if (this.stimeArry.length == 0) {
        this.$notify({
          title: "失败",
          message: "请输入时间",
          type: "error"
        });
        return;
      }
      this.getDate();
    },
    allEnsure() {
      this.centerAll();
    },
    //获取数据
    getDate() {
      let that = this;
      if (this.type == "渠道确认") {
        var objOrginization = {
          type: "需结算",
          timeStart: "",
          timeEnd: ""
        };
        if (this.stimeArry.length > 0) {
          objOrginization.timeStart = new Date(
            this.stimeArry[0]
          ).toLocaleDateString();
          objOrginization.timeEnd = new Date(
            this.stimeArry[1]
          ).toLocaleDateString();
        }
        api.BrokerageOrganzationList(that, objOrginization, function(msg) {
          that.tableData3 = msg.Result;
          that.pagecount = msg.ListCount;
        });
        return;
      }
      if (this.type == "渠道退保") {
        api.GetBackBrokerageList(that, {}, function(msg) {
          that.tableData3 = msg.Result;
          that.pagecount = msg.ListCount;
        });
      }
    }
  },
  activated() {
    // console.log("确认" + this.type);
    this.getDate();
  }
};
</script>
